import React from "react";

import { Form, Input, Button, Select, Table, Space, Switch } from "antd";
const { Option } = Select;

const Sale = () => {
  const columns = [
    {
      title: '序号',
      dataIndex: 'num',
      key: 'num',
    },
    {
      title: '楼盘名称',
      dataIndex: 'name',
      key: 'name',
    },
    {
      title: '详细地址',
      dataIndex: 'address',
      key: 'address',
    },
    {
      title: '价格',
      key: 'tags',
      dataIndex: 'tags',
    },
    {
      title: '排序',
      dataIndex: 'sort',
      key: 'sort',
    },
    {
      title: '更新时间',
      dataIndex: 'date',
      key: 'date',
    },
    {
      title: '状态',
      dataIndex: 'state',
      key: 'state',
      render: text => <Switch checkedChildren="正常" unCheckedChildren="关闭" defaultChecked />
    },
    {
      title: '经纪人',
      key: 'examine',
      dataIndex: 'examine',
    },
    {
      title: '操作',
      key: 'action',
      render: (text, record) => (
        <Space size="middle">
          <Button type='link'>详情</Button>
          <Button type='link'>编辑</Button>
          <Button type='link'>删除</Button>
          <Button type='link'>指派经纪人</Button>
        </Space>
      ),
    },
  ];

  const data = [
    {
      key: '1',
      name: '龙华尚城',
      num: 1,
      address: '北京市昌平区沙河镇顺沙路19号',
      sort: 1,
      date: new Date().toLocaleString(),
      state: '',
      examine: '蒋蒋蒋'
    },
    {
      key: '2',
      name: '水晶花园',
      num: 2,
      address: '北京市昌平区沙河镇顺沙路19号',
      sort: 1,
      date: new Date().toLocaleString(),
      state: '',
      examine: '将将将'
    },
    {
      key: '3',
      name: '龚华新村',
      num: 3,
      address: '北京市昌平区沙河镇顺沙路19号',
      sort: 1,
      date: new Date().toLocaleString(),
      state: '',
      examine: '蒋蒋蒋'
    },
  ];
  const [form] = Form.useForm();
  // select改变
  const onGenderChange = () => { };
  return (
    <div className="sale">
      <Form layout="inline" form={form}>
        <Form.Item>
          <Select placeholder="请选择省份" onChange={onGenderChange} allowClear>
            <Option value="male">山西省</Option>
            <Option value="female">湖南省</Option>
            <Option value="other">广东省</Option>
          </Select>
        </Form.Item>
        <Form.Item>
          <Select placeholder="请选择城市" onChange={onGenderChange} allowClear>
            <Option value="male">运城市</Option>
            <Option value="female">怀化市</Option>
            <Option value="other">深圳市</Option>
          </Select>
        </Form.Item>
        <Form.Item>
          <Select placeholder="请选择区县" onChange={onGenderChange} allowClear>
            <Option value="male">盐湖区</Option>
            <Option value="female">耀县</Option>
            <Option value="other">南山区</Option>
          </Select>
        </Form.Item>
        <Form.Item>
          <Input placeholder="关键字" />
        </Form.Item>
        <Form.Item>
          <Button type="primary">搜索</Button>
        </Form.Item>
      </Form>
      <div className="sale_main">
        <Button type='primary'>新增</Button>
        <Table columns={columns} dataSource={data} />
      </div>
    </div>
  );
};

export default Sale;
